//使用高阶组件封装 路由 守卫 == 登录拦截 == 验证token
import React, { useEffect } from 'react'
import { useHistory, useLocation } from 'react-router-dom'

function yztoken(Com) { //1.接受一个组件为参数

    //2.返回一个新组件
    return function token(props) {
        let history = useHistory()
        let location = useLocation()
        //在初始周期和更新周期中验证
        useEffect(() => {
            //不是登录页面
            if (location.pathname !== '/login') {
                //验证token是否存在
                let token = localStorage.getItem('token')
                if (!token) {
                    //跳转到登录页
                    history.push('/login')
                }
            }
        })
        return (
            <>
                <Com {...props} />
            </>
        )
    }
}

export default yztoken
